<template>

    <div id="id">
  
      <top></top>
      <Navigation></Navigation>
          <div class="specia-loffer-sp" style="margin: auto;width:80%;margin-top: 40px;left:10px;" >

            <div v-if="flag">
                <el-empty description="没有搜索到任何商品,换个关键词试试吧!"></el-empty>
            </div>
            <div v-else>
            <div class="specia-loffer-box"  v-for="item in tableData">
               <div class="specia-loffer-box-sp" @click="detail(item.t_dityId,item.t_id)" style="width:230px;background-color:#fff;float: left;margin-left: 40px;margin-top: 40px;padding-bottom: 10px;cursor:pointer;border-radius: 5px;">
                    <div class="specia-sp-img">
                       <img style="width:100%;height:230px;border-radius: 5px;" :src="item.t_imgurl" alt="">
                          </div>
                           <div class="specia-sp-title">{{item.t_name}}</div>
                            <div class="specia-sp-jg">￥{{item.t_price}}</div>
          <div class="specia-sp-pf" style="margin:auto; text-align: center;margin-top: 10px;">
           <el-rate v-model="item.score"></el-rate>
          </div>
           </div>
         </div>
</div>
</div>         
  
    
  
    </div>
  
  </div>
  </template>
  
  <script>
    export default {
  
      data() {
        return {
            radio: 3,
            tableData:[],
            dialogVisible: false,
            show2: false,
            t_email:'',
            t_id:'',
            url:'',
            flag:false
            
        }
      },
      mounted:function(){
        this.loadexecution();
    },
      methods: {
  
        detail(dityId,id){
            this.$router.push({path: '/DetailPage',query:{ dityId:dityId,id:id}});
        },
    
        async loadexecution(){ 
        const {data:res} = await this.$http.post('person/finSearchProducts',this.$qs.stringify({name:this.$route.query.input,email:JSON.parse(localStorage.getItem('email'))}));
        if(res.success==true){
        this.tableData = res.result;
        console.log(this.tableData)
        //将字符串格式转换为对应的数组格式
        for(var i=0;i<this.tableData.length;i++)
        {
          var img =  this.tableData[i].t_imgurl.replace("[",""); 
              img =  img.replace("]",""); 
              img =  img.replace(/\"/g, "");
          this.tableData[i].t_imgurl =img.split(",");
        }
          }else{
              this.flag = true;
          }


        },

  
  
  
      }
    }
  </script>
  

  <style scoped>


    .specia-sp-jg
    {
        text-align: center;margin-top: 10px; font-size: 18px;color: #85bd02;font-weight: 600;
    }
    .specia-sp-title
    {
        text-align: center;
        margin-top: 8px;
        font-weight: 600;
        font-size: 15px;
        height:30px;
    }
    .mindd_img
    {
        float: left;
    }

    .mindd_imput
    {
        width:60%;
        float: left;
        margin-top: 10px;
        margin-left: 15%;
    }
    .main_mindd
    {
        width:100%;
        height:120px;
        background-color: #fff;
    }
    .main_mindd_m
    {
        margin: auto;
        width: 60%;
        padding: 30px;
    }
    /* .header_top{
       margin: auto;
    } */
    .el-carousel__item h3 {
    color: #475669;
    font-size: 14px;
    opacity: 0.75;
    line-height: 200px;
    margin: 0;
  }
  
  .el-carousel__item:nth-child(2n) {
    background-color: #99a9bf;
  }
  
  .el-carousel__item:nth-child(2n+1) {
    background-color: #d3dce6;
  }
</style>
  